<template>
	<ul id="class_tree" class="ztree"></ul>
</template>
<script lang="ts">
import { toRefs, reactive, ref } from 'vue';
import '/@/utils/ztree/zTreeStyle/zTreeStyle.css';
import '/@/utils/ztree/jquery.js';
import '/@/utils/ztree/jquery.ztree.core.js';
import '/@/utils/ztree/jquery.ztree.excheck.js';
import '/@/utils/ztree/jquery.ztree.exedit.js';
import '/@/components/ztree/index.vue';
export default {
	name: 'ztree',
	components: {},
	setup() {
		const state: any = reactive({});
		const loadTree = (name: string, data: [], setting: object) => {
			let tree = {
				name: name,
				id: '0',
				parent: '0',
				drag: false,
				children: data,
			};
			//console.log( 'setting',setting);
			$.fn.zTree.init($('#class_tree'), setting, tree);
			const treeobj = $.fn.zTree.getZTreeObj('class_tree');
			//$.fn.zTree.getZTreeObj("class_tree").expandAll(true);
			treeobj.expandNode(treeobj.getNodes()[0], true);
		};
		const getTreeObj = () => {
			return $.fn.zTree.getZTreeObj('class_tree');
		};

		return {
			loadTree,
			...toRefs(state),
			getTreeObj,
		};
	},
};
</script>

<style>
</style>
